Ext.define('FrontSuite.shared.view.RegistrationWizard', {
    extend: 'FrontSuite.shared.view.Wizard',
    alias: 'widget.regwizard',
    id: 'register-view',
    titlePrefix: 'Register for a new account',
    includeSubTitle: false,
    floating: true,
    centered: true,
    modal: true,
    bodyPadding: 5,
    width: 560,
    items: [
        {
            index: 0,
            xtype: 'fieldset',
            // html: 'Hello world 0',
            items: [{
                xtype: 'textfield',
                fieldLabel: 'First Name',
                name: 'first_name',
                allowBlank: false
            },{
                xtype: 'textfield',
                fieldLabel: 'Last Name',
                name: 'last_name',
                allowBlank: false
            },{
                xtype: 'textfield',
                fieldLabel: 'Nick Name (how you wish to be called)',
                name: 'nick_name',
                allowBlank: false
            },{
                xtype: 'textfield',
                fieldLabel: 'Username (only letters and numbers)',
                name: 'username',
                allowBlank: false
            },{
                xtype: 'textfield',
                fieldLabel: 'Email Address',
                name: 'email',
                inputType: 'email',
                allowBlank: false
            },{
                xtype: 'textfield',
                fieldLabel: 'Email Address (again, to confirm)',
                name: 'email2',
                inputType: 'email',
                allowBlank: false
            },{
                xtype: 'password',
                fieldLabel: 'Password',
                name: 'p',
                inputType: 'password',
                allowBlank: false
            },{
                xtype: 'password',
                fieldLabel: 'Password (again, to confirm)',
                name: 'p2',
                inputType: 'password',
                allowBlank: false
            }]
        },
        {
            index: 1,
            html: 'Hello world 1'
        },
        {
            index: 2,
            html: 'Hello world 2'
        },
        {
            index: 3,
            html: 'Hello world 3',
            finishable: true
        }
    ],
    listeners: {
        beforerender: function() {
            Ext.each(this.getLayout().getLayoutItems(), function(card) {
                card.preventHeader = true;
            });
        },
        wizardpagechange: function(wizard) {
            var toolbar = wizard.getDockedComponent('bottomToolBar');
            if (wizard.activeItem > 0) {
                toolbar.child('#next').enable();
                toolbar.child('#prev').enable();
            }

            if (wizard.activeItem == 0) {
                toolbar.child('#prev').disable();
            }

            if (wizard.activeItem == (wizard.items.length - 1)) {
                toolbar.child('#next').disable();
            }

            if (wizard.getActiveItem().finishable)
                toolbar.child('#finish').enable();
            else
                toolbar.child('#finish').disable();

            // Update the title to have the correct page number
            if (this.includeSubTitle) {
                wizard.getActiveItem().preventHeader = true;
                wizard.setTitle(wizard.titlePrefix + ' (' + (wizard.activeItem+1) + ' of ' + this.items.length + ') ' + this.getActiveItem().title);
            } else {
                wizard.setTitle(wizard.titlePrefix + ' (' + (wizard.activeItem+1) + ' of ' + this.items.length + ')');
            }
        },
        wizardcancelled: function(wizard) {
            wizard.hide();
        },
        wizardfinished: function(wizard) {
            wizard.hide();
        }
    }
});

//        xtype: 'datefield',
//        fieldLabel: 'Birth Date',
//        name: 'birthDate',
//        allowBlank: false
//    },{
//        fieldLabel: 'Cell Phone',
//        name: 'cellphone',
//        allowBlank: true
//    },{
//        fieldLabel: 'Encrypted Password Hash',
//        name: 'encryptedPasswordHash',
//        allowBlank: true
//    }],

